<template>
	<view>
		<view style="padding-left: 30rpx;padding-right: 30rpx;" v-if="title == '修改昵称'">
			<u-form ref="uForm">
				<u-form-item label="昵称" :label-width="130">
					<u-input v-model="nickname" placeholder="请输入昵称"/>
				</u-form-item>
			</u-form>
		</view>
		
		<view style="padding-left: 30rpx;padding-right: 30rpx;" v-if="title == '修改姓名'">
			<u-form ref="uForm">
				<u-form-item label="姓名" :label-width="130">
					<u-input v-model="name" placeholder="请输入姓名"/>
				</u-form-item>
			</u-form>
		</view>

		<view style="padding-left: 30rpx;padding-right: 30rpx;" v-if="title == '修改手机号'">
			<u-form ref="uForm">
				<u-form-item label="手机号" :label-width="130">
					<u-input v-model="moblie" placeholder="请输入原手机号"/>
				</u-form-item>
				<u-form-item label="验证码" :label-width="130">
					<u-input v-model="code" placeholder="请输入验证码"/>
					<template v-slot:right>
						<u-button @click="getCode">{{tips}} <text v-if="tips!= '获取验证码'">s</text> </u-button>
					</template>
				</u-form-item>
				<u-form-item label="新手机号" :label-width="130">
					<u-input v-model="moblie" placeholder="请输入新手机号"/>
				</u-form-item>
			</u-form>
		</view>
		<view class="but" @click="edit(title)">确认</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				nickname: '',
				code:'',
				moblie:'',
				tips:'获取验证码',
				timer:'',
				title: '',
				name: '',
			}
		},
		onLoad(options) {
			if (options.title) {
				this.title = options.title
				uni.setNavigationBarTitle({
					title: options.title
				});
			}
		},
		methods:{
			getCode(){
				if(this.tips == '获取验证码'){
					this.tips = 60
					this.countDown()
				}
			},
			edit(title) {
				console.log(title);
				if(title =='修改昵称'){
					this.$ajaxRequest.put(this.baseUrl + 'user/Info', {
						nickname: this.nickname
					}, true).then(res => {
						if (res.data.code == 200) {
							uni.navigateBack({
								delta:1
							})
						} else {
							uni.showToast({
								title:res.data.msg,
								icon: 'none'
							})
						}
					})
				}else if(title =='修改姓名'){
					this.$ajaxRequest.put(this.baseUrl + 'user/Info', {
						name: this.name
					}, true).then(res => {
						if (res.data.code == 200) {
							uni.navigateBack({
								delta:1
							})
						} else {
							uni.showToast({
								title:res.data.msg,
								icon: 'none'
							})
						}
					})
				}
			},
			// codeAjax() {
			// 	if (this.countDownNum == '获取验证码') {
			// 		this.countDownNum = 60
			// 		this.countDown()
					
			// 		this.$ajaxRequest.post(this.baseUrl + '/api/sendcode', {
			// 			mobile: this.mobile
			// 		}, false).then(res => {
			// 			if (res.data.success) {
			// 				uni.showToast({
			// 					title:res.data.info,
			// 					icon: 'none'
			// 				})
			// 			} else {
			// 				uni.showToast({
			// 					title:res.data.info,
			// 					icon: 'none'
			// 				})
			// 			}
			// 		})
			// 	} else {
					
			// 	}
			// },
			countDown() {
				let countDownNum = this.tips;
				console.log(countDownNum)
				this.timer = setInterval(() => {
					countDownNum--
					this.tips = countDownNum
					if (countDownNum <= 0) {
						// this.codeJudge = true
						this.tips = '获取验证码'
						clearInterval(this.timer)
					}
				}, 1000)
			},
		}
	}
</script>

<style>
	.inp {
		padding: 20rpx 30rpx 20rpx 30rpx;
		border-bottom: 1rpx solid rgba(167, 167, 167, .2);
	}

	.but {
		position: fixed;
		bottom: 30rpx;
		width: 690rpx;
		left: 30rpx;
		padding: 20rpx 0rpx 20rpx 0rpx;
		text-align: center;
		font-size: 30rpx;
		background: linear-gradient(-17deg, rgba(255, 114, 59, 1), rgba(255, 147, 67, 1));
		color: white;
		border-radius: 40rpx;
	}
</style>
